( function flexible( window, document ) {
  var docEl = document.documentElement

  var dpr = window.devicePixelRatio || 1
  document.querySelector( 'html' ).setAttribute( 'data-dpr', dpr )

  // adjust body font size
  function setBodyFontSize () {
    if (document.body) {
      document.body.style.fontSize = 16 + 'px'
    }
    else {
      document.addEventListener('DOMContentLoaded', setBodyFontSize)
    }
  }
  setBodyFontSize();

  function setRemUnit() {
    var rem = docEl.clientWidth / 10
    docEl.style.fontSize = rem + 'px'
    var html = document.querySelector( 'html' )
    var fSize = 'font-size:' + rem + 'px!important';
    html.setAttribute( 'style', fSize )
  }
  setRemUnit()

  window.addEventListener( 'resize', setRemUnit )
  window.addEventListener( 'pageshow', function ( e ) {
    if ( e.persisted ) {
      setRemUnit()
    }
  } )

  if ( dpr >= 2 ) {
    var fakeBody = document.createElement( 'body' )
    var testElement = document.createElement( 'div' )
    testElement.style.border = '.5px solid transparent'
    fakeBody.appendChild( testElement )
    docEl.appendChild( fakeBody )
    if ( testElement.offsetHeight === 1 ) {
      docEl.classList.add( 'hairlines' )
    }
    docEl.removeChild( fakeBody )
  }
}( window, document ) )